<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %> 
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>考试题列表</title>

		<meta name="description" content="Static &amp; Dynamic Tables" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />

		<!-- bootstrap & fontawesome -->
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/bootstrap.min.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/font-awesome.min.css" />

		<!-- page specific plugin styles -->

		<!-- text fonts -->
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/ace-fonts.css" />

		<!-- ace styles -->
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/ace.min.css" id="main-ace-style" />

		<!--[if lte IE 9]-->
			<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/ace-part2.min.css" />
		<!--[endif]  -->
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/ace-skins.min.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/ace-rtl.min.css" />

		<!--[if lte IE 9]-->
		  <link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/ace-ie.min.css" />
		<!-- [endif]-->

		<!-- inline styles related to this page -->

		<!-- ace settings handler -->
		<script src="${pageContext.request.contextPath}/static/assets/js/ace-extra.min.js"></script>

		<!-- HTML5shiv and Respond.js for IE8 to support HTML5 elements and media queries -->

		<!--[if lte IE 8]-->
		<script src="${pageContext.request.contextPath}/static/assets/js/html5shiv.min.js"></script>
		<script src="${pageContext.request.contextPath}/static/assets/js/respond.min.js"></script>
		<!--[endif]-->
		<script src="${pageContext.request.contextPath}/static/assets/js/jquery.min.js"></script>
		<script src="${pageContext.request.contextPath}/static/assets/js/test/showTestList.js"></script>
		<%
		String path = request.getContextPath();
		request.setAttribute("path", path);
		%>
		<style>
		#addTestForm input[type="text"],#addTestForm textarea{
		width:380px;
		}
		#addTestForm .testTypeScore{
		display:inline-block;
		margin-left:50px;
		}
		
</style>
   </head>
<body class="no-skin">
<input type="hidden" id="path" value="${path}">
		<!-- #section:basics/navbar.layout -->
	
		<!-- /section:basics/navbar.layout -->
		<div class="main-container" id="main-container">
			<script type="text/javascript">
				try{ace.settings.check('main-container' , 'fixed')}catch(e){}
			</script>

			<!-- #section:basics/sidebar -->
	
			<!-- /section:basics/sidebar -->
			<div class="main-content">
				<!-- #section:basics/content.breadcrumbs -->
		
				<!-- /section:basics/content.breadcrumbs -->
				<div class="page-content">
					<!-- #section:settings.box -->
					<div class="ace-settings-container" id="ace-settings-container">
						<div class="btn btn-app btn-xs btn-warning ace-settings-btn" id="ace-settings-btn">
							<i class="ace-icon fa fa-cog bigger-150"></i>
						</div>

						<div class="ace-settings-box clearfix" id="ace-settings-box">
							<div class="pull-left width-50">
								<!-- #section:settings.skins -->
								<div class="ace-settings-item">
									<div class="pull-left">
										<select id="skin-colorpicker" class="hide">
											<option data-skin="no-skin" value="#438EB9">#438EB9</option>
											<option data-skin="skin-1" value="#222A2D">#222A2D</option>
											<option data-skin="skin-2" value="#C6487E">#C6487E</option>
											<option data-skin="skin-3" value="#D0D0D0">#D0D0D0</option>
										</select>
									</div>
									<span>&nbsp; Choose Skin</span>
								</div>

								<!-- /section:settings.skins -->

								<!-- #section:settings.navbar -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-navbar" />
									<label class="lbl" for="ace-settings-navbar"> Fixed Navbar</label>
								</div>

								<!-- /section:settings.navbar -->

								<!-- #section:settings.sidebar -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-sidebar" />
									<label class="lbl" for="ace-settings-sidebar"> Fixed Sidebar</label>
								</div>

								<!-- /section:settings.sidebar -->

								<!-- #section:settings.breadcrumbs -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-breadcrumbs" />
									<label class="lbl" for="ace-settings-breadcrumbs"> Fixed Breadcrumbs</label>
								</div>

								<!-- /section:settings.breadcrumbs -->

								<!-- #section:settings.rtl -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-rtl" />
									<label class="lbl" for="ace-settings-rtl"> Right To Left (rtl)</label>
								</div>

								<!-- /section:settings.rtl -->

								<!-- #section:settings.container -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-add-container" />
									<label class="lbl" for="ace-settings-add-container">
										Inside
										<b>.container</b>
									</label>
								</div>

								<!-- /section:settings.container -->
							</div><!-- /.pull-left -->

							<div class="pull-left width-50">
								<!-- #section:basics/sidebar.options -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-hover" />
									<label class="lbl" for="ace-settings-hover"> Submenu on Hover</label>
								</div>

								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-compact" />
									<label class="lbl" for="ace-settings-compact"> Compact Sidebar</label>
								</div>

								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-highlight" />
									<label class="lbl" for="ace-settings-highlight"> Alt. Active Item</label>
								</div>

								<!-- /section:basics/sidebar.options -->
							</div><!-- /.pull-left -->
						</div><!-- /.ace-settings-box -->
					</div><!-- /.ace-settings-container -->

					<!-- /section:settings.box -->
					<div class="page-content-area">
						<div class="page-header">
							<h1>
								Tables
								<small>
									<i class="ace-icon fa fa-angle-double-right"></i>
									考试题列表
								</small>
							</h1>
						</div><!-- /.page-header -->

						<div class="row">
							<div class="col-xs-12">
								<!-- PAGE CONTENT BEGINS -->
								<div class="row">
									<div class="col-xs-12">
										<table id="sample-table-1" class="table table-striped table-bordered table-hover">
											<thead>
											<tr><th colspan="6"><a href="changeLanguage?localeType=en_US"><spring:message code="page.index.english" /></a></th><th colspan="6"><a href="changeLanguage?localeType=zh_CN"><spring:message code="page.index.chinese" /></a></th></tr>
											<tr><th colspan="12"><a title="新增考题" class="tn btn-primary btn-xs add-test"><spring:message code="page.index.add" /></a></th></tr>
												<tr>
													<th class="center">
														<label class="position-relative">
															<input type="checkbox" class="ace" />
															<span class="lbl"></span>
														</label>
													</th>	
													<th><spring:message code="test.id.message" /></th>
													<th><spring:message code="subject.name.message" /></th>
													<th><spring:message code="test.content.message" /></th>
													<th><spring:message code="test.choose_a.message" /></th>
													<th><spring:message code="test.choose_b.message" /></th>
													<th><spring:message code="test.choose_c.message" /></th>
													<th><spring:message code="test.choose_d.message" /></th>
													<th><spring:message code="test.answer.message" /></th>
													<th><spring:message code="testtype.test_type.message" /></th>
													<th><spring:message code="testtype.test_type_score.message" /></th>												
													<th>
														<i class="ace-icon fa fa-clock-o bigger-110 hidden-480"></i>
														<spring:message code="test.action.message" />
													</th>													
												</tr>
											</thead>

											<tbody>											
											<c:if test="${not empty message }">
											<script type="text/javascript">
											alert('${message}');
											</script>
											</c:if>
											
											   <c:forEach items="${testList}" var="test">
												<tr>
													<td class="center">
														<label class="position-relative">
															<input type="checkbox" class="ace" />
															<span class="lbl"></span>
														</label>
													</td>
													<td>${test.id }</td>
													<td>${test.sub.name }</td>
													<td ><div class="content">${test.content }</div></td>
													<td ><div class="choose">${test.chooseA }</div></td>
													<td ><div class="choose">${test.chooseB }</div></td>
													<td ><div class="choose">${test.chooseC }</div></td>
													<td ><div class="choose">${test.chooseD}</div></td>
													<td >${test.answer }</td>
													<td >${test.examTestType.testType }</td>
													<td >${test.examTestType.testTypeScore }分</td>
													<td>
													    <a title="查看考题" class="tn btn-primary btn-xs show-test"><i class="ace-icon fa fa-comment"></i></a>
													    <a title="修改试题" class="btn btn-primary btn-xs edit-test"><i class="ace-icon fa fa-pencil"></i></a>
													    <a title="删除试题" class="btn btn-primary btn-xs delete-test"><i class="ace-icon fa fa-trash-o"></i></a>																				
													</td>

													
												</tr>
												 </c:forEach>
											</tbody>
										</table>
									</div><!-- /.span -->
								</div><!-- /.row -->

								

								
					</div><!-- /.page-content-area -->
				</div><!-- /.page-content -->
			</div><!-- /.main-content -->
		

	
			<a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
				<i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
			</a>
		</div><!-- /.main-container -->
		<!-- 新增考题模态框 -->
		<div class="modal fade" id="addTestModal" tabindex="-1" role="dialog" aria-labelledby="addTestModalLabel" aria-hidden="true">
		<div class="modal-dialog">
		<div class="modal-content">
		<div class="modal-header">
		<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
		&times;
		</button>
		<h4 class="modal-title" id=addTestModalLabel">
		新增考题
		</h4>
		</div>
		<div class="modal-body">
		<form id="addTestForm" method="post">
		<p><label>考题科目：&nbsp;&nbsp;</label><select name="sub_id"></select></p>
		<p><label>考题类型：&nbsp;&nbsp;</label><select name="testType"></select><label class="testTypeScore"></label></p>
		<p><label>题目：&nbsp;&nbsp;</label><textarea name="content" cols="50" rows="8" placeholder="填写考题内容"></textarea></p>
		<p><label>选项A：&nbsp;&nbsp;</label><input type="text" name="chooseA" placeholder="填写候选答案内容， 作为选项A ." /></p>
	    <p><label>选项B：&nbsp;&nbsp;</label><input type="text" name="chooseB" placeholder="填写候选答案内容， 作为选项B ." /></p>
		<p><label>选项C：&nbsp;&nbsp;</label><input type="text" name="chooseC" placeholder="填写候选答案内容， 作为选项C ." /></p>
		<p><label>选项D：&nbsp;&nbsp;</label><input type="text" name="chooseD" placeholder="填写候选答案内容， 作为选项D ." /></p>
		<p><label>答案：&nbsp;&nbsp;</label>
		<span class="answerTotal">
		<input type="radio" name="answer" value="A" checked />
		<input type="checkbox" name="answer" value="A" />选项A
		<input type="radio" name="answer" value="B"  />
		<input type="checkbox" name="answer" value="B" />选项B
		<input type="radio" name="answer" value="C"  />
		<input type="checkbox" name="answer" value="C" />选项C
		<input type="radio" name="answer" value="D" />
		<input type="checkbox" name="answer" value="D" />选项D					
		</span>
		</p>
		</form>
		</div>
		<div class="modal-footer">
		<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
		<button id="addTestSaveBtn" type="button" class="btn btn-primary">保存</button>
		</div>
		</div>
		</div>
		</div>
		<!-- 修改考题模态框 -->
		<div class="modal fade" id="editTestModal" tabindex="-1" role="dialog" aria-labelledby="editTestModalLabel" aria-hidden="true">
		<div class="modal-dialog">
		<div class="modal-content">
		<div class="modal-header">
		<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
		&times;
		</button>
		<h4 class="modal-title" id=editTestModalLabel">
		修改考题
		</h4>
		</div>
		<div class="modal-body">
		<form id="editTestForm" method="post">
		<input type="hidden" id="testId" value="" />
		<p><label>考题科目：&nbsp;&nbsp;</label><select name="sub_id"></select></p>
		<p><label>考题类型：&nbsp;&nbsp;</label><select name="testType"></select><label class="testTypeScore"></label></p>
		<p><label>题目：&nbsp;&nbsp;</label><textarea name="content" cols="50" rows="8" placeholder="填写考题内容"></textarea></p>
		<p><label>选项A：&nbsp;&nbsp;</label><input type="text" name="chooseA" placeholder="填写候选答案内容， 作为选项A ." /></p>
	    <p><label>选项B：&nbsp;&nbsp;</label><input type="text" name="chooseB" placeholder="填写候选答案内容， 作为选项B ." /></p>
		<p><label>选项C：&nbsp;&nbsp;</label><input type="text" name="chooseC" placeholder="填写候选答案内容， 作为选项C ." /></p>
		<p><label>选项D：&nbsp;&nbsp;</label><input type="text" name="chooseD" placeholder="填写候选答案内容， 作为选项D ." /></p>
		<p><label>答案：&nbsp;&nbsp;</label>
		<span class="answerTotal">
		<input type="radio" name="answer" value="A"  />
		<input type="checkbox" name="answer" value="A" />选项A
		<input type="radio" name="answer" value="B"  />
		<input type="checkbox" name="answer" value="B" />选项B
		<input type="radio" name="answer" value="C"  />
		<input type="checkbox" name="answer" value="C" />选项C
		<input type="radio" name="answer" value="D" />
		<input type="checkbox" name="answer" value="D" />选项D					
		</span>
		</p>
		</form>
		</div>
		<div class="modal-footer">
		<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
		<button id="editTestBtn" type="button" class="btn btn-primary">修改</button>
		</div>
		</div>
		</div>
		</div>
		
		
		
		<!-- 查看详细考题  -->
		<div class="modal fade" id="showTestModal" tabindex="-1" role="dialog" aria-labelledby="showTestModalLabel" aria-hidden="true">
		<div class="modal-dialog">
		<div class="modal-content">
		<div class="modal-header">
		<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
		&times;
		</button>
		<h4 class="modal-title" id="showTestModalLabel">
		查看详细考题
		</h4>
		</div>
		<div class="modal-body">
		<label>考题科目：&nbsp;&nbsp;</label><span class="sub-name"></span><br />
		<label>题目：&nbsp;&nbsp;</label><span class="content"></span>&nbsp;&nbsp; ---&nbsp;&nbsp;(<span class="test-type"></span>,每题<span class="test-type-score"></span>分)<br />
		<label>A：&nbsp;&nbsp;</label><span class="choose_a"></span><br />
		<label>B：&nbsp;&nbsp;</label><span class="choose_b"></span><br />
		<label>C：&nbsp;&nbsp;</label><span class="choose_c"></span><br />
		<label>D：&nbsp;&nbsp;</label><span class="choose_d"></span><br />
		<label style="font-weight:bold;">答案：&nbsp;&nbsp;</label><span class="answer" style="font-weight:bold;"></span><br />
		</div>
		<div class="modal-footer">
		<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
		</div>
		</div>
		</div>
		</div>	
	</body>
</html>


